<template>
    <div class="organize-tree-wrapper">
        <el-input :placeholder="labelTextObj.filterPlaceholder" v-model="keyword" @input="searchTree">
        </el-input>
        <el-tree
            class="filter-tree"
            :data="treeData"
            :props="{
                label: 'nodeName',
                children: 'childList'}"
            :default-expanded-keys="expandedKeys"
            node-key='nodeId'
            :check-strictly="true"
            :highlight-current="true"
            :expand-on-click-node="false"
            :filter-node-method="filterNode"
            @node-click="clickTreeNode"
            ref="tree">
        </el-tree>
    </div>
</template>

<script>
export default {
    name: 'OrganizeTree',
    props: {
        treeData: {
            type: Array,
            default: () => []
        },
        expandedKeys: {
            type: Array,
            default: () => []
        }
    },
    data () {
        var labelTextObj = {
            filterPlaceholder: '输入关键字进行过滤'
        };
        return {
            labelTextObj,
            keyword: ''
        };
    },
    methods: {

        // 搜索树
        searchTree () {
            this.$refs.tree.filter(this.keyword);
        },
        // 点击选择组织树节点
        clickTreeNode (data) {
            // 全局看板任选节点
            // if (data.nodeType === 5 || data.nodeType === '5') {
            this.$emit('update-selected-node', data);
            // }
        },
        filterNode (value, data, node) {
            if (!value) return true;
            return data.nodeName.indexOf(value) !== -1;
        }
    },
    mounted () {

    }
};
</script>
